<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>表单练习</title>
  <link rel="stylesheet" type="text/css" href="./css/72.css">
</head>
<body>
  <div>
    <img class="tree" src="./img/tree.jpg">
    <form class="contact_form" action="#" method="post" name="contact_form">
      <ul>
        <li class="usually">
          <h2>用户注册</h2>
        </li>
        <li class="usually">
          <span>昵称:</span>
          <input type="text" id="name" name="name" required />
        </li>
        <li class="usually">
          <span>注册邮箱:</span>
          <input type="email" name="email" placeholder="javin@example.com" required />
        </li>
        <li class="usually">
          <span>密码:</span>
          <input type="password" name="password" required />
        </li>
        <li class="special">
          <span>性别:</span>
          <input type="radio" name="sex" id="male" checked />
          <label for="male">男</label>
          <input type="radio" name="sex" id="female" />
          <label for="female">女</label>
        </li>
        <li class="usually">
          <span>年龄:</span>
          <input type="number" name="age" required />
        </li>
        <li class="special">
          <span>兴趣爱好:</span>
          <input type="checkbox" id="football" name="interest">
          <label for="football">足球</label>
          <input type="checkbox" id="basketball" name="interest">
          <label for="football">篮球</label>
          <input type="checkbox" id="swim" name="interest">
          <label for="football">游泳</label>
          <input type="checkbox" id="sing" name="interest">
          <label for="football">唱歌</label>
          <input type="checkbox" id="yoga" name="interest">
          <label for="football">瑜伽</label>
        </li>
        <li class="usually">
          <span>自我介绍:</span>
          <textarea name="introduce" placeholder="Please enter your message" required></textarea>
        </li>
        <li class="usually">
          <button>立即注册</button>
        </li>
      </ul>
    </form>
  </div>
</body>
</html>